<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title></title>
  </head>
  <body>
    <div id="app">
      <input type="text" @keyup.delete=del v-model="msg" placeholder="del键清空">
      <input type="text" placeholder="获取键位" @keyup="getCode" v-model="code">
      <input type="text" placeholder="自定义按键,按空格键试试" @keyup.32="say" v-model="info">
    </div>
    <script src="./vue.js"></script>
    <script>
      const vm=new Vue({
        el:'#app',
        data:{msg:"",code:"",info:""},
        methods:{
          del(){
            console.log('按del键清空');
            this.msg=""
          },
          getCode(e){
            console.log(e.keyCode);
            //如空格键是32
            this.code=e.keyCode
          },
          say(){
           this.info= "这个键是空格键"
          }
        },
       })
    </script>
  </body>
</html>